<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="robots" content="all,follow">
  <!-- Bootstrap CSS-->
  <script src="assets/js/vue.js"></script>
  <script src="assets/js/axios.js"></script>
  <link rel="stylesheet" href="assets/css/element.css">

  <!-- 引入组件库 -->
  <script src="assets/js/element.js"></script>
  <link rel="stylesheet" href="vendor/bootstrap/css/bootstrap.min.css">
  <!-- Font Awesome CSS-->
  <link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
  <!-- Fontastic Custom icon font-->
  <link rel="stylesheet" href="css/fontastic.css">
  <!-- Google fonts - Poppins -->
  <link href="assets/css/fonts.css" rel="stylesheet">
  <!-- theme stylesheet-->
  <link rel="stylesheet" href="css/style.default.css" id="theme-stylesheet">
  <!-- Custom stylesheet - for your changes-->
  <link rel="stylesheet" href="css/custom.css">
  <!-- Favicon-->
  <link rel="shortcut icon" href="img/favicon.ico">
  <!-- Tweaks for older IEs-->
  <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->
</head>

<body>
  <div id="app" class="page login-page">
    <div class="container d-flex align-items-center">
      <div class="form-holder has-shadow">
        <div class="row">
          <!-- Logo & Information Panel-->
          <div class="col-lg-6">
            <div class="info d-flex align-items-center">
              <div class="content">
                <div class="logo">
                  <h1>登录</h1>
                </div>
                <p>管理员登录页面</p>
              </div>
            </div>
          </div>
          <!-- Form Panel    -->
          <div class="col-lg-6 bg-white">
            <div class="form d-flex align-items-center">
              <div class="content">
                <form method="POST" @submit.prevent="login" class="form-validate">
                  <div class="form-group">
                    <input v-model="form.username" id="login-username" type="text" name="loginUsername" required
                      data-msg="Please enter your username" class="input-material">
                    <label for="login-username" class="label-material">用户名</label>
                  </div>
                  <div class="form-group">
                    <input v-model="form.password" id="login-password" type="password" name="loginPassword" required
                      data-msg="Please enter your password" class="input-material">
                    <label for="login-password" class="label-material">密码</label>
                  </div>
                  <a id="login" type="submit" @click="login" class="btn btn-primary">登录</a>
                  <a id="login" style="float:right" href="../computer/index.html" class="btn btn-primary">去主站</a>
                  <!-- This should be submit button but I replaced it with <a> for demo purposes-->
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="copyrights text-center">
    </div>
  </div>
  <!-- JavaScript files-->
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/popper.js/umd/popper.min.js"> </script>
  <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
  <script src="vendor/jquery.cookie/jquery.cookie.js"> </script>
  <script src="vendor/chart.js/Chart.min.js"></script>
  <script src="vendor/jquery-validation/jquery.validate.min.js"></script>
  <!-- Main File-->
  <script src="js/front.js"></script>
</body>
<script>
  var app = new Vue({
    el: '#app',
    data: {
      toUrl: '',
      seen: true,
      list: [],
      otherList: [],
      userInfo: {},
      formLabelWidth: '140px',
      form: {
        password: ''
      },
      dialogFormVisible: false,

    },
    methods: {
      login() {
        let form = this.$data.form
        axios({
          method: 'POST',
          headers: {
            'token': sessionStorage.getItem('token'),
          },
          url: 'http://127.0.0.1:888/member/login',
          data: form
        }).then((re) => {
          if (re.data.code === 0) {
            if (re.data.content.status == 1) {
              this.$message.error("您的账号已被封停！")
              return false
            }
            this.$message({
              message: '登录成功',
              type: 'success'
            });
            this.$data.userInfo = re.data.content.member
            sessionStorage.setItem('userInfo', JSON.stringify(re.data.content.member))
            sessionStorage.setItem('token', JSON.stringify(re.data.content.token))
            setTimeout(`location.href = ("${this.$data.toUrl == '' ? 'index.html' : this.$data.toUrl}")`, 500)

          } else {
            this.$message.error(re.data.content);

          }
        })
      },
      GetRequest() {
        var url = location.search; //获取url中"?"符后的字串  
        var theRequest = new Object();
        if (url.indexOf("?") != -1) {
          var str = url.substr(1);
          strs = str.split("&");
          for (var i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
          }
        }
        return theRequest;
      }


    },
    mounted() {
      let _this = this
      let param = _this.GetRequest()
      if (param.backUrl != undefined) {
        _this.$data.toUrl = param.backUrl
      }
    }

  })


</script>

</html>